@import "variables";
@import "mixins";

body {
  overflow: hidden;
  .user-select(none);
  -webkit-text-size-adjust:none;
}

.btn-global {
  position: absolute;
  z-index: 100;
  .opacity(0.7);
  width: 60px;
}

.ui-icon-loading {
  background: url(/js/libs/jquerymobile/images/ajax-loader.gif) !important;
}

.ui-icon,
.ui-icon-searchfield:after {
  background-image: url(/js/libs/jquerymobile/images/icons-18-white.png) /*{global-icon-set}*/;
}


.ui-icon-alt {
  background-image: url(/js/libs/jquerymobile/images/icons-18-black.png);
}


.panel-right {
  right:0;
  z-index:100;
  position: fixed;
  top: 0;
  border-left: 0.15em;
  border-bottom: 0.15em;
  border-bottom-left-radius: 1em;
  border-color: #B3B3B3;
  background-color:#BCBCBC;
  border-top: 0;
  border-right: 0;
  border-style: solid;
}

.panel-left {
  left:0;
  top: 0;
  z-index:100;
  position: fixed;

  border-right: 0.15em;
  border-bottom: 0.15em;
  border-bottom-right-radius: 1em;
  border-color: #B3B3B3;
  background-color:#BCBCBC;
  border-top: 0;
  border-left: 0;
  border-style: solid;
}

.panel-icon {

  height: 52px;
  width: 62px;
}

.panel-icon-logout {
  background: url('/img/views/overview/standby_48x48.png') no-repeat center center;
}

.panel-icon-device {
  background: url('/img/views/device/device_48x48.png') no-repeat center center;
}

.panel-icon-settings {
  background: url('/img/views/device/settings_48x48.png') no-repeat center center;
}

/**
 * 	Scrollview
 */
.ui-content.ui-scrollview-clip {
  padding: 0;
}
.ui-content.ui-scrollview-clip > div.ui-scrollview-view {
  margin: 0;
  padding: 15px;
}
.ui-content.ui-scrollview-clip > .ui-listview.ui-scrollview-view {
  margin: 0;
}


.square {
  width: 98px;
  height: 98px;
  border: solid 1px #333;
  text-align: center;
  line-height: 100px;
  font-size: 60px;
}

.ui-scrollview-clip .ui-scrollview-clip .square {
  background-color: #3CF;
}

.ui-scrollview-clip .ui-scrollview-clip .ui-scrollview-clip .square {
  background-color: #F39;
}

.ui-scrollview-clip .ui-scrollview-clip .ui-scrollview-clip .ui-scrollview-clip .square {
  background-color: #0F6;
}

.ui-scrollview-clip .ui-scrollview-clip .ui-scrollview-clip .ui-scrollview-clip .ui-scrollview-clip .square {
  background-color: #FF6;
}

.ui-corner-all {
  .border-radius(.35em);
}

/**
 * 	MobiScroll settings
 */
.dwv {
  display:none;
}

.dwbg {

  .dwb-a {
    @hgbtn_dark: darken(@hdBaseColor, 35%);
    @hgbtn_light: desaturate(@hdBaseColor,45%);
    .gradient-btn(@hgbtn_dark,@hgbtn_light);
  }
}

/**
 * 	Misc content pages settings
 */
#mapview .ui-content,
#device .ui-content {
  padding:0;
  margin:0;
  overflow: hidden;
  .user-select(none);
  -webkit-text-size-adjust:none;
}

/**
 * 	Map View
 */
#mapview {
  background: #BCBCBC;
}

#mapview div.olMapViewport {
  z-index:0;
}

#mapview .btn-back {
  top: 5px;
  right: 5px;
}

/**
 * 	Device View
 */
.content-primary .ui-bar {
  height: 110px;
}
.content-primary .ui-bar.settings {
  background: url('/img/views/device/settings_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.mapview {
  background: url('/img/views/device/world_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.rx {
  background: url('/img/views/device/headphone_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.df {
  background: url('/img/views/device/wifi_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.status {
  background: url('/img/views/device/status_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.locate {
  background: url('/img/views/device/locate_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.overview {
  background: url('/img/views/device/overview_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.device {
  background: url('/img/views/device/device_48x48.png') no-repeat center center;
}

.content-primary .ui-bar.msgcenter {
  background: url('/img/views/device/msgcenter_48x48.png') no-repeat center center;
}

/* XXX: this is probly to big for mobile device !! */
.content-primary .ui-bar .slot-wrapper {
  text-align:left;
  vertical-align:baseline;
  position:absolute;
  bottom: 5px;
  font-size: 1.2em;
  left: 10px;
}

/* XXX: this is probly to big for mobile device !! */
.content-primary .ui-bar .slot-wrapper .slot {
  position: relative;
  margin:auto;
  text-align:left;
}


/**
 * 	Device Overview
 */
#overview #overview_list .list-element {
  margin-top: 20px;
}

#overview #overview_list .list-element div.ui-btn-text {
  margin-left:40px;
}

.ui-listview .ui-li-thumb {
/*background: url('/img/views/images/ddf/ddf04e_icon.gif') 0 15px  no-repeat;*/
  height: 120px;
  width: 160px;
  max-width: 160px;
  margin-left:10px;
}

.ui-listview .ui-li-thumb.ddf04e {
  background: url('/img/views/images/ddf/ddf04e_icon.gif') left top  no-repeat;
}

.ui-listview .ui-li-thumb.ddf100m {
  background: url('/img/views/images/ddf/ddf100m_icon.gif') left top  no-repeat;
}

.ui-listview .ui-li-thumb.ddf195 {
  background: url('/img/views/images/ddf/ddf195_icon.gif') left top  no-repeat;
}

.ui-listview .ui-li-thumb.ddf255 {
  background: url('/img/views/images/ddf/ddf255_icon.gif') left top  no-repeat;
}

/**
 * 	MapView Coordinates-Container
 */
.olControlMousePosition {
  border: 1px solid red;
  bottom: 100px;
  right: -200px;
}

/**
 * 	Mapview
 */
#device .devicelist {
  float: left;
}

#device .devicelist ul {
  margin: 0;
}

/**
 * 	MapView - Scale Line
 */
.olControlScaleLine {
  right: 10px !important;
}

/**
 * 	StatusView
 */
#status ul.log {
  list-style-type: none;
  background: #fff;
  -webkit-margin-before: 0em;
  -webkit-margin-after: 0em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  -webkit-padding-start: 0px;
}

#status ul.log li {
  margin: 0px;
  color: #444;
  text-shadow: none;
  padding: 0px;
  height: 80px;
  padding-top: 15px;
  padding-left: 15px;
  border-bottom: 1px gray solid;
}

#status ul.log li span.headline {
  padding: 0;
  margin: 0;
  font-weight: bold;
  font-size: 16px;
  display: block;
}

#status ul.log li span.text {
  font-size: 14px;
}

/* Sensorlog styles */

#status ul.sensorlog li.name {
  padding-right: 20px;
  font-weight: bold;
}

#status ul.sensorlog li .bar {
  height: 25px;
  text-align: center;
  vertical-align: middle;
  line-height: 25px;
  color: #fff;
  text-shadow: none;
}
#status ul.sensorlog li .ok {
  background-color: green;
}

#status ul.sensorlog li .warning {
  background-color: yellow;
}

#status ul.sensorlog li .error {
  background-color: red;
}

/**
 * RX View
 */

#rx svg {
  background-color: #000000;
}